<template lang="">
  <div>
    <div class="_cart _p20 _m-b-20">
      <el-input
        v-if="isEdit"
        type="textarea"
        :autosize="{ minRows: 5, maxRows: 100 }"
        v-model="content"
        placeholder="请输入内容"
      ></el-input>
      <span v-else>{{ content }}</span>
    </div>
    <div class="_text-a-r">
      <el-button v-if="!isEdit" type="primary" @click="isEdit = true"
        >编辑</el-button
      >
      <el-button v-else type="primary" @click="save()">保存</el-button>
    </div>
  </div>
</template>
<script>
import toolAction from "@/tool/http/tool-action";
const textAction = toolAction.init("sys_text");
export default {
  props: {
    modelValue: {
      type: String,
    },
  },
  data() {
    return {
      content: "请输入内容",
      isEdit: false,
    };
  },
  mounted() {
    if (this.modelValue) {
      textAction.view({ id: this.modelValue }).then((res) => {
        this.content = JSON.stringify(res.text);
      });
    }
  },
  methods: {
    save() {
      textAction
        .sync({ id: this.modelValue, text: this.content })
        .then((id) => {
          this.$element.msg();
          this.isEdit = false;
          this.$emit("update:modelValue", id);
        });
    },
  },
};
</script>
<style scoped></style>
